define(['knockout', 'store', 'util'], function (ko, Store, Util) {
    function ViewModel(params) {
        Util.extend(this, params);

        var scope = this;

        scope._shuttleStyle = {};

        if(scope.params.height) scope._shuttleStyle.height = Util.calculateSize(scope.params.height);
        //the store create from a model
        if (scope.params) {
            if (scope.params.store) {//the store create out site the vm
                scope.store = scope.params.store;
            }
            else if (scope.params.model) {
                scope.store = new Store({
                    model: scope.params.model,
                    pageSize: 0,//,
                    autoLoad: true
                    // onInitComplete:function () {
                    //     scope.store.load();
                    // }
                });
                //scope.leftItems = store.records;
                //scope.rightItems = scope.params._items;
                //scope.displayName = scope.params.displayName;
            }

            if (scope.store) {
                scope.store.addLoadListener('complete', function () {
                    var lItems = scope.leftItems();

                    scope.rightItems().forEach(function (item) {
                        for (var lIndex = 0; lIndex < lItems.length; ++lIndex) {
                            if (item.id() == lItems[lIndex].id()) {
                                lItems.splice(lIndex, 1);
                                break;
                            }
                        }
                    });

                    scope.leftItems(lItems);
                });

                scope._queryForm = ko.observable();

                if (scope.params.queryForm) {
                    scope.store.createModel({
                        callback: function (data) {
                            scope._queryForm({name: 'cmp:{0}'.formatTpl(scope.params.queryForm),params:{store:scope.store,record:data}});
                        }
                    });

                    scope.store.setProxy({url: ''});
                }

                scope.leftItems = scope.store.records;
                scope.rightItems = scope.params._items;
                scope.displayName = scope.params.displayName;
            }
        }

        if (!scope.displayName) scope.displayName = 'text';
        if (!scope.leftItems) scope.leftItems = ko.observableArray();
        if (!scope.rightItems) scope.rightItems = ko.observableArray();

        scope.leftChosenItems = ko.observableArray();
        scope.rightChosenItems = ko.observableArray();
        scope.onShuttle = function (op) {
            switch (op) {
                case 'ar'://all to right
                    pushItems(scope.leftItems(), scope.rightItems);
                    scope.leftItems.removeAll();
                    break;
                case 'r'://one right
                    pushItems(scope.leftChosenItems(), scope.rightItems);
                    spliceItems(scope.leftChosenItems(), scope.leftItems);
                    break;
                case 'l'://on left
                    pushItems(scope.rightChosenItems(), scope.leftItems);
                    spliceItems(scope.rightChosenItems(), scope.rightItems);
                    break;
                case 'al'://all to left
                    pushItems(scope.rightItems(), scope.leftItems);
                    scope.rightItems.removeAll();
                    break;
            }
        };

        function pushItems(items, container) {
            if (items.length > 0) {
                items.forEach(function (item) {
                    container.push(item);
                });
            }
        }

        function spliceItems(items, container) {
            if (items.length > 0) {
                items.forEach(function (item) {
                    container.remove(item);
                });
            }
        }
    }

    return ViewModel;
});
